<!DOCTYPE html>
<html lang="zh-cmn-Hans">
<head>
    <meta charset="UTF-8">
    <title>支付账户</title>
    <link rel="stylesheet" type="text/css" href="../css/index.css?v=_VERSION_" />
    <link rel="stylesheet" href="../css/common.css"/><!-- 基本样式 -->
    <link rel="stylesheet" href="../css/animate.min.css"/> <!-- 动画效果 -->
    <script src="../js/jquery.js" type="text/javascript" charset="utf-8"></script>
    <script language="javascript" type="text/javascript" src="../js/My97DatePicker/WdatePicker.js"></script>
</head>
<body>


<div class="payment-main">
    <div class="new-box">
        <div class="new-left-title">
            <div class="titlepsss" style="padding-bottom: 10px;">
                <span class="lintp"></span>
                <a href="" title="" class="act" style="padding-bottom: 13px;width: 75px;margin-left: -14px;text-align: right;line-height: 40px;">支付账户<em></em></a>
            </div>
        </div>
    </div>

    <div class="broker-box2">
        <div class="withselect span1">
            <span>平台</span>
            <input type="text" name="firstname" value="">
            <label>
                <a href="" title="" class="btnp">查询</a>
            </label>
            <div class="right-main">
                <a href="JavaScript:void(0);" class="demo05">添加银行信息</a>
            </div>

            <div class="clear"></div>
        </div>
    </div>

    <div class="broker-box3">
        <ul>
            <li>
                <span class="broker-span2">银行名称</span>
                <span class="broker-span3">操作</span>
            </li>

            <li>
                <span class="broker-span7">中国工商银行</span>
                <span class="broker-span8 demo08"><a href="javascript:void(0);">编辑</a></span>
                <span class="broker-span10"><a href="javascript:void(0);">删除</a></span>
            </li>

            <li>
                <span class="broker-span7">中国工商银行</span>
                <span class="broker-span8 demo08"><a href="javascript:void(0);">编辑</a></span>
                <span class="broker-span10"><a href="javascript:void(0);">删除</a></span>
            </li>

            <li>
                <span class="broker-span7">中国工商银行</span>
                <span class="broker-span8 demo08"><a href="javascript:void(0);">编辑</a></span>
                <span class="broker-span10"><a href="javascript:void(0);">删除</a></span>
            </li>

            <li>
                <span class="broker-span7">中国工商银行</span>
                <span class="broker-span8 demo08"><a href="javascript:void(0);">编辑</a></span>
                <span class="broker-span10"><a href="javascript:void(0);">删除</a></span>
            </li>

            <li>
                <span class="broker-span7">中国工商银行</span>
                <span class="broker-span8 demo08"><a href="javascript:void(0);">编辑</a></span>
                <span class="broker-span10"><a href="javascript:void(0);">删除</a></span>
            </li>

            <li>
                <span class="broker-span7">中国工商银行</span>
                <span class="broker-span8 demo08"><a href="javascript:void(0);">编辑</a></span>
                <span class="broker-span10"><a href="javascript:void(0);">删除</a></span>
            </li>

            <li>
                <span class="broker-span7">中国工商银行</span>
                <span class="broker-span8 demo08"><a href="javascript:void(0);">编辑</a></span>
                <span class="broker-span10"><a href="javascript:void(0);">删除</a></span>
            </li>

            <li>
                <span class="broker-span7">中国工商银行</span>
                <span class="broker-span8 demo08"><a href="javascript:void(0);">编辑</a></span>
                <span class="broker-span10"><a href="javascript:void(0);">删除</a></span>
            </li>
        </ul>
    </div>

    <div class="broker-box4">
        <div class="page-module">
            <ul>
                <li>上一页</li>
                <li class="">1</li>
                <li class="act">2</li>
                <li>3</li>
                <li>4</li>
                <li>5</li>
                <li>...</li>
                <li>99</li>
                <li>下一页</li>
            </ul>
        </div>
    </div>

</div>









<!--信号描述 demo0弹出div 弹窗-->
<div id="HBox">

        <ul class="list list2">

            <li>
                <span class="span1">银行信息</span>
            </li>

            <li>
                <span>银行名称</span>
                <input class="input1" type="text" value="" placeholder="&nbsp;&nbsp;请输入名称" />
            </li>

            <li>
                <div class="fl">
                    <input type="submit" value="提交" class="submitBtn" />
                    <input type="submit" value="返回" class="submitBtn2" onclick="javascript:location.reload();" />
                </div>
            </li>

        </ul>

</div><!-- HBox end -->







<!--第二个弹出层-->
<div id="HBox2">

        <ul class="list list2">

            <li>
                <span class="span1">银行信息2</span>
            </li>

            <li>
                <span>银行名称2</span>
                <input class="input1" type="text" value="" placeholder="&nbsp;&nbsp;请输入名称" />
            </li>

            <li>
                <div class="fl">
                    <input type="submit" value="提交" class="submitBtn" />
                    <input type="submit" value="返回" class="submitBtn2" onclick="javascript:location.reload();" />
                </div>
            </li>

        </ul>



</div><!-- HBox end -->






<!--弹窗功能 弹窗JS-->
<script src="../js/jquery.min.js"></script>

<script src="../js/jquery.hDialog.js"></script>

<script>

    $(function(){

        var $el = $('.dialog');

        $el.hDialog();



        //带标题的

        $('.demo0').hDialog({title: '信号描述',height: 450});

        $('.demo01').hDialog({title: '设置净值条件平仓',height: 300,width: 350});

        $('.demo02').hDialog({title: '提交新密码',height: 300,width: 350});

        $('.demo05').hDialog({title: '添加银行',height: 250,width: 450});
        $('.demo08').hDialog({title: '编辑银行信息',box: '#HBox2',height: 250,width: 450});
        //改变宽度

        $('.demo1').hDialog({width: 500});



        //改变高度

        $('.demo2').hDialog({height: 400});



        //改变宽和高

        $('.demo3').hDialog({width:600,height: 500});



        //改变位置

        $('.demo4').hDialog({positions: 'top'});



        //不清空表单

        $('.demo5').hDialog({resetForm: false});



        //遮罩不可关闭

        $('.demo6').hDialog({modalHide: false});



        //改变弹框背景色

        $('.demo7').hDialog({boxBg: '#eeeeee'});



        //改变遮罩背景色

        $('.demo8').hDialog({modalBg: 'rgba(255,255,255,0.7)'});



        //改变关闭背景色

        $('.demo9').hDialog({closeBg: '#4A74B5'});



        //错误文字提示

        $('.demo10').click(function(){

            $.tooltip('My God, 出错啦！！！');

        });



        //正确文字提示

        $('.demo11').click(function(){

            $.tooltip('OK, 操作成功！', 2500, true);

        });



        //显示加载

        $('.demo12').click(function(){

            //自定义文字： $.showLoading('玩命加载中...');

            //自定义宽高： $.showLoading('努力加载中...',140,40);

            $.showLoading();

        });



        //移除加载

        $('.demo13').click(function(){

            $.hideLoading();

        });



        //显示前的回调方法

        $('.demo14').hDialog({beforeShow: function(){

            alert('显示前执行');

        }});



        //隐藏后的回调方法

        $('.demo15').hDialog({afterHide: function(){

            alert('隐藏后执行');

        }});



        //fadeOut淡出关闭效果

        $('.demo16').hDialog({effect: 'fadeOut'});



        //悬浮触发

        $('.demo17').hDialog({triggerEvent: 'mouseenter'});



        //不显示关闭按钮

        $('.demo18').hDialog({closeHide: false});



        //返回顶部

        $.goTop();



        //提交并验证表单

        $('.submitBtn').click(function() {

            var $nickname = $('.nickname');

            var $email = $('.email');

            var $phone = $('.phone');

            if($nickname.val() == ''){

                $.tooltip('昵称还没填呢...'); $nickname.focus();

            }else if($phone.val() == ''){

                $.tooltip('内容还没填呢...'); $phone.focus();

            }else{

                $.tooltip('提交成功，2秒后自动关闭',2000,true);

                setTimeout(function(){

                    //$el.hDialog('close',{box:'#HBox'},'http://smwell.sinaapp.com/');  //也可以加跳转链接哦~





                    $el.hDialog('close',{box:'#HBox'});

                },2000);

            }

        });





    });

</script>
</body>
</html>